/**
 * RuleTitleEditForm
 * @authors 杨兴洲（of2502）
 * @date    2017/5/26 0026 17:14
 * @version 1.0
 * @last-modify  杨兴洲（of2502）
 */

import {Form, Input, Button} from 'antd';
const FormItem = Form.Item;

export default class RuleTitleEditForm extends Component {
    static defaultProps = {
        updateTitle: () => void 0,
        title: ""
    };

    constructor(props) {
        super(props);
        this.state = {
            title: props.title
        };
    }

    render() {
        return (
            <Form inline>
                <FormItem>
                    <Input size="small" placeholder="自定义规则名称,不超过30个字"
                           onChange={e => this.setState({title: e.target.value})} value={this.state.title}/>
                </FormItem>
                <FormItem>
                    <Button size="small" type="primary" onClick={this.updateTitle}>确认</Button>
                </FormItem>
                <FormItem>
                    <Button size="small" onClick={this.hideTitlePopover}>取消</Button>
                </FormItem>
            </Form>
        );
    }

    updateTitle = async () => {
        if (!this.state.title || this.state.title.length > 30) {
            message.error("新建标题不能空或者超过30个字");
            return;
        }
        this.setState({title: ""});
        this.props.updateTitle();
    };

    hideTitlePopover = () => {
        this.setState({titlePopVisible: false})
    };
}